import Vue from "vue";
import VueRouter from "vue-router";

Vue.use(VueRouter);

const routes = [
  {
    path: "/",
    redirect: "/home",
  },
  {
    path: "/index",
    name: "index",
    component: () => import("../views/Index.vue"),
    children: [
      {
        path: "/home",
        name: "home",
        component: () => import("../views/Home.vue"),
      },
      {
        path: "/search",
        name: "search",
        component: () => import("../views/Search.vue"),
      },
    ],
  },
  {
    path: "/my",
    name: "my",
    component: () => import("../views/PersonalCenter.vue"),
  },
  {
    path: "/detail",
    name: "detail",
    component: () => import("../views/Detail.vue"),
  },
  {
    path: "/shopcar",
    name: "shopcar",
    component: () => import("../views/Shopcar.vue"),
    beforeEnter(to, from, next) {
      if (localStorage.getItem("islogin")) {
        next();
      } else {
        next("/login");
      }
    },
    //单个路由规则独享的守卫，跟组件内守卫实现的效果是一样的
  },
  {
    path: "/describe",
    name: "describe",
    component: () => import("../views/Describe.vue"),
  },
  {
    path: "/login",
    name: "login",
    component: () => import("../views/Login.vue"),
  },
];

const router = new VueRouter({
  routes,
});

// router.beforeEach((to, from, next) => {
//   console.log(to, from);
//   if (localStorage.getItem("islogin")) {
//     next();
//   } else {
//     // next("/login");
//     //会产生一个死循环，所以需要判断一个，如果是login页面就放行，不是的话再跳转login
//     if (to.path == "/login") {
//       next();
//     } else {
//       next("/login");
//     }
//   }
// });

//导航守卫 除了到了某个时候会自动执行，而且会拦截路由的跳转，知道执行next()
//路由跳转之前

// router.afterEach((to, from) => {
//   console.log(to, from);
// });
//路由跳转之后

export default router;
